<!--@ 首页 -->
<template>
	<view class="bg-white" v-if="dataSource && dataSource.order">
		<u-notify ref="uNotify" />

		<view class="cu-bar bg-white  margin-top-xs" v-if="dataSource.order">
			<view class="action">
				<text class="cuIcon-title text-cyan"></text>
				<text class="text-df text-cyan text-bold">
					<text class="text-cyan text-df text-bold padding-left-xs">
						{{`${dataSource.order.projectSubtitle}( ${ dataSource.workDetails.length} )`}}
					</text>
				</text>
			</view>
			<view class="action" v-if="dataSource.order.state ==0">
				<view class="cu-btn sm bg-cyan" @click="handeNew()">添加</view>
			</view>
		</view>
		<view class="padding-lr-sm">
			<uni-easyinput clearable v-model="customerName" @clear="handeCenter()" placeholder="请输入内容">
				<template #right>
					<view class="padding-right-sm text-blue" @click="handeCenter()">搜索</view>
				</template>
			</uni-easyinput>
		</view>

		<uni-card margin="1" :is-shadow="false" padding="0" v-for="(item,index) in dataSource.workDetails" :key="index"
			style="position: relative;padding:0px !important">
			<view class="bg-gradual-caye1">
				<view class="flex  padding-tb-sm padding-sm solid-bottom align-center justify-between "
					style="margin:0px !important">
					<view class="flex align-center">
						<view class="cu-avatar sm round  bg-cyan">{{dataSource.workDetails.length - index}}
						</view>
						<view class="margin-left-xs">{{item.belongingTo}}</view>
					</view>
					<view class="text-cyan">{{item.orderStartDate}}</view>
				</view>
			</view>
			<view class="flex margin-tb align-center justify-between">
				<view v-if="item.picPath" class="flex"  style="flex-wrap:wrap;">
					<view @click.stop="handeImage(index2,item)" v-for="(item2,index2) in handItyCard(item.picPath)"
						:key="index2" class="margin-xs">
						<image :src="item2" class="cu-avatar lg round "></image>
					</view>
				</view>
			</view>
			<view class="text-cyan letter2 padding-top-sm padding-left-lg margin-bottom-xxl"
				style="white-space: pre-line;border-top: 1upx solid rgba(0, 0, 0, 0.1)"> {{ item.projectTitle }} </view>
			<view style="position: absolute;bottom: 4px;right: 4px;" class="text-gray">{{item.username}}</view>
		</uni-card>
		<remarkMode ref="remarkFrom" @ok="loadData" />
		<NewTutorialsMode ref="NewTutorialsFrom" @ok="$emit('ok',1)" />
	</view>
</template>
<script>
	import loadFlex from '@/components/loadFlex/loadFlex.vue' //加载框
	import remarkMode from '@/components/remarkMode.vue' //备注
	import NewTutorialsMode from '@/components/oderType/NewTutorialsMode.vue' //新增
	import myApi from '@/utils/app.js' //调用接口使
	export default {
		name: 'manufacture',
		components: {
			loadFlex,
			remarkMode,
			NewTutorialsMode
		},
		props: {
			ShowAdmin: {
				type: Boolean,
				default: false
			},
			dataSource: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {
				loading: false,
				searchVal: '',
				model: {},
				customerName: ''
			}
		},
		computed: {
			handItyCard() {
				return function(text) {
					if (text) return text.split(",")
					return []
				}
			},
		},
		methods: {
			async loadData(index) {
				this.$emit('ok', 1)
			},
			handeRemack(item) {
				this.$refs.remarkFrom.OnPortuni(item)
			},
			handeComplete(item) {
				let that = this
				uni.showModal({
					title: '提示',
					content: '确认自我确定吗？',
					success: function(res) {
						if (res.confirm) that.handeNoApply(item)
					},
				})
			},
			onNotify(round) {
				this.$refs.uNotify.show({
					type: round.type ? round.type : 'success',
					message: round.message ? round.message : '删除成功',
					top: 50
				})
			},
			async handeNoApply(item) {
				this.loading == true
				try {
					const res = await this.$request({
						url: myApi.selfOk,
						method: 'post',
						data: {
							orderNo: item.orderId,
							vto: {
								id: item.id
							}
						},
					});
					console.log(res)
					if (res.code == 200) {
						this.$emit('ok', 1)
						setTimeout(() => (
							this.onNotify({
								message: '操作成功'
							})), 1000);
					}
				} catch (e) {
					// 失败执行

				} finally {
					// 销毁执行
					this.loading = false
				}
			},
			handeImage(index, item) {
				const imgs = item.picPath.split(",").map(item => {
					//只返回图片路径
					return item
				})
				console.log(imgs);
				//调用预览图片的方法
				uni.previewImage({
					urls: imgs,
					current: index
				})

			},
			handeNew() {
				this.$refs.NewTutorialsFrom.onProblem(this.dataSource)
			},
			handeCompleted(item) { // 完结
				const that = this
				uni.showModal({
					title: '提示',
					content: '确定要完结吗？',
					success: function(res) {
						if (res.confirm) that.onCompleted(item)
					},
				})
			},
			async onCompleted(item) {
				console.log(item)
				this.loading = true
				try {
					const res = await this.$request({
						url: myApi.bmsProjectGressOrderOver,
						method: 'post',
						data: {
							orderNo: item.orderId,
							vto: {
								id: item.id
							}
						},
					});
					console.log(res)
					if (res.code == 200) {
						this.$emit('ok', 1)
						setTimeout(() => (
							this.onNotify({
								message: '操作成功'
							})), 1000);
					}
				} catch (e) {
					// 失败执行

				} finally {
					// 销毁执行
					this.loading = false
				}
			},
			handeCenter() {
				this.$emit('center', this.customerName)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.box {
		background-color: #CBEDED;
	}
</style>